<template>
    <div>
        <h1>登录</h1>
        <table class="table table-bordered">
            <tr>
                <td>用户名</td>
                <td><input type="text" v-model="str.name"></td>
            </tr>
            <tr>
                <td>密码</td>
                <td><input type="password" v-model="str.pwd"></td>
            </tr>
            <tr>
                <td></td>
                <td><input type="button" value="登录" @click="Login"></td>
            </tr>
        </table>
    </div>
</template>

<script setup lang="ts">
import { reactive, toRefs, onMounted } from 'vue';
import { useRoute, useRouter } from 'vue-router';
import axios from 'axios';

let route = useRoute();
let router = useRouter();
let data: any = reactive({
    str: {
        name: '',
        pwd: '',
    },
});
let { str } = toRefs(data);

const Login = () => {
    if (str.value.name == "") {
        alert("用户名不能为空");
        return;
    }
    if (str.value.pwd == "") {
        alert("密码不能为空");
        return;
    }
    let obj = {
        name: str.value.name,
        pwd: str.value.pwd
    }

    axios({
        url: '/api/Login/LoginList',
        method: 'get',
        params: obj
    }).then((res) => {
        if (res.data.data == -1) {
            alert("用户名错误")
            return;
        }
        else if (res.data.data == -2) {
            alert("密码错误")
            return;
        }
        else {
            alert("登录成功")
            router.push('/add')
        }
    })

}
</script>

<style scoped></style>